
<html>
<head>
    <title>首页</title>
    <script src="/plugins/pace-0.7.5/pace.js"></script>
    <link href="/plugins/pace-0.7.5/themes/black/pace-theme-center-circle.css" rel="stylesheet" />
    <!-- Bootstrap 3.3.6 -->
    <link rel="stylesheet" href="/css/bootstrap.min.css">
    <link rel="stylesheet" href="/style/bootstrap/css/bootstrap.css">
    <!-- Font Awesome -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.5.0/css/font-awesome.min.css">
    <!-- Ionicons -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ionicons/2.0.1/css/ionicons.min.css">
    <!-- Theme style -->
    <link rel="stylesheet" href="/css/AdminLTE.min.css">
    <link rel="stylesheet" href="/plugins/animate/animate.css">
    <!-- AdminLTE Skins. Choose a skin from the css/skins
         folder instead of downloading all of them to reduce the load. -->
    <link rel="stylesheet" href="/css/skins/my_all-skins.css">
    <!-- MyAdminLTE.css -->
    <link rel="stylesheet" href="/css/MyAdminLTE.css">
    <!-- Lobibox -->
    <link rel="stylesheet" href="/plugins/lobibox/css/lobibox.min.css">


</head>
<body >
<div id="app" class="container projects">
    <div class="row">
        <span v-if="sings==null"><h1>投票暂时还未开启</h1></span>
        <span v-else>
        <div class="col-sm-6 col-md-4 col-lg-3 " v-for="el in sings" :id="el.id">
            <div class="thumbnail">
                <div class="caption">
                    <h1 style=" text-align:center">{{el.id}}号</h1>
                    <h3 style=" text-align:center">{{el.singname}}</h3>
                    <button class="btn btn-primary btn-block">票数：{{el.number}}</button>
                </div>
            </div>

        </div>
        </span>
    </div>
</div>



<!-- jQuery 2.2.3 -->
<script src="/plugins/jQuery/jquery-2.2.3.min.js"></script>
<!-- Bootstrap 3.3.6 -->
<script src="/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="/js/bootstrap.js">
<!--vue-->
<script src="/plugins/vue/vue.js"></script>
<!-- SlimScroll -->
<script src="/plugins/slimScroll/jquery.slimscroll.min.js"></script>
<!-- FastClick -->
<script src="/plugins/fastclick/fastclick.js"></script>
<!-- AdminLTE App -->
<script src="/js/app.min.js"></script>
<!-- AdminLTE for demo purposes -->
<script src="/js/demo.js"></script>
<script src="/plugins/echarts/echarts.min.js"></script>
<script src="/plugins/lobibox/js/lobibox.min.js"></script>
<script src="/js/common.js"></script>
<script>
    $(function() {

        getAllsing();
        var timer = window.setInterval(function () {
            getAllsing();
        },3000);
    });
    var vm=new Vue({
        el:"#app",
        data:{
            sings:{}
        },
        methods:{
            getAllsing:function () {
                getAllsing();
            }
        }
    })
    function  getAllsing() {
        $.post("/battle/selectSingVoByBattle", function(result){
            result=eval(result);
            vm.sings = result;
            if(result==null){
                clearInterval(timer);
            }
        });

    }
</script>
</body>
</html>
